// 供方加扣款结算 详情
<template>
    <!-- 集采汇总编辑页 -->
    <div class="e-form">
        <BillTop @cancel="handleClose"></BillTop>
        <!-- //详情 添加页面 ↓ -->
        <div class="tabs">
            <div class="tabs-title">基本信息</div>
            <div style="width: 100%" class="form">
                <el-form
                    ref="form"
                    :model="formData"
                    label-width="150px"
                    :rules="formDataRules"
                >
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="单据机构：">
                                <!-- <el-input v-model="formData.settlementUnitName"></el-input> -->
                                <span>{{ formData.orgName }}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="加扣款日期："
                                prop="settlementDate"
                            >
                                <el-date-picker
                                    v-model="formData.settlementDate"
                                    type="date"
                                    placeholder="选择日期"
                                    value-format="yyyy-MM-dd"
                                    :clearable="false"
                                >
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="备注">
                                <el-input
                                    type="textarea"
                                    :rows="2"
                                    resize="none"
                                    placeholder="请输入内容"
                                    v-model="formData.remarks"
                                    maxlength='500'
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
        </div>

        <div class="buttons">
            <el-button
                type="primary"
                class="btn-blue"
                @click="theSubmit"
                size="small"
                >保存</el-button
            >
            <el-button size="small" @click="handleClose">取消</el-button>
        </div>
    </div>
</template>

<script>
import '@/utils/jquery.scrollTo.min'
import { formatDate } from '@/utils/common'

import auditRequest from '@/api/materialSettlement/supplierAddpayment.js'

import { showLoading, hideLoading } from '@/utils/common'

export default {
    data () {
        return {
            formData: {
                baseCurId: '',
                baseCurName: '',
                baseCurPlusDeductionAmount: 0,
                baseCurRate: 0,
                baseCurReturnDepositAmount: 0,
                billId: '',
                billNo: '',
                contractBillId: '',
                contractBillNo: '',
                contractName: '',
                contractType: 0,
                currency: '',
                currencyId: '',
                easId: '',
                evaluationLevel: '',
                founderId: '',
                founderName: '',
                gmtCreate: '',
                gmtModified: '',
                nullifyCreated: '',
                nullifyCreator: '',
                nullifyCreatorId: '',
                nullifyDescription: '',
                nullifyReason: '',
                orgId: '',
                orgName: '',
                plusDeductionAmount: '',
                remarks: '',
                returnDepositAmount: '',
                rmbId: '',
                rmbName: '',
                rmbPlusDeductionAmount: 0,
                rmbRate: 0,
                rmbReturnDepositAmount: 0,
                settlementDate: formatDate(new Date(), 'yyyy-MM-dd'), //结算日期
                settlementUnitId: '',
                settlementUnitName: '',
                state: 0,
                workId: ''
            },
            user: {}, //本地储存用户信息
            orgId: '', //机构id
            orgName: '', //机构名称
            //验证
            formDataRules: {
                settlementDate: [
                    {
                        required: true,
                        message: '请选择加扣款日期',
                        trigger: 'blur'
                    }
                ]
            }
        }
    },
    async created () {
        this.user = JSON.parse(localStorage.getItem('vuex'))
        this.$set(this.formData, 'orgName', this.user.userInfo.orgInfo.orgName)
        this.$set(this.formData, 'orgId', this.user.userInfo.orgInfo.orgId)
    },
    methods: {
        //点击保存
        theSubmit () {
            showLoading()
            auditRequest.onsave(this.formData).then(res => {
                hideLoading()
                this.clientPop(
                    'info',
                    '保存成功!是否进行下一步操作？',
                    () => {
                        this.$router.push({
                            path: '/supplierAddpaymentEdit',
                            query: {
                                billid: res,
                                name: 'planDetail'
                            }
                        })
                    },
                    null,
                    this.handleClose
                )
            })
        },
        //取消
        handleClose () {
            this.$router.replace('/supplierAddpaymentList')
        }
    }
}
</script>

<style lang="scss" scoped>
.buttons {
    left: 0;
}
.e-form {
    margin-bottom: 80px;
    padding: 0 20px;
    .tabs-title::before {
        content: '';
        height: 22px;
        width: 8px;
        border-radius: 40px;
        background-color: #2e61d7;
        display: block;
        position: absolute;
        left: 20px;
        margin-right: 20px;
    }
}
</style>
